<%@ page language="java" contentType="text/html; charset=UTF-8"
  pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html lang="zh-CN">

<head>
<title>飞腾会-FitaClub</title>
<%@ include file="/WEB-INF/include/meta.jsp"%>
<%@ include file="/WEB-INF/include/css.jsp"%>
</head>
<!-- end header -->

<body>
  <div class="page-group">
    <div class="page page-current bg-light-gray">
      <header class="bar bar-nav fita-header">
        <a href="javascript:history.back(-1);" class="icon icon-left pull-left"></a>
        <a href="${ctx.host}/cars/search" class="button pull-right">重选</a>
        <h1 class="title time-title">
          <div class="item">
            <p>${pickupLocation.cityName}</p>
            <span class="time">${carDetail.pickupDateTime}</span>
          </div>
          <div class="item day"><p class="no-margin">${days}天</p></div>
          <div class="item">
            <p>${returnLocation.cityName}</p>
            <span class="time">${carDetail.returnDateTime}</span>
          </div>
        </h1>
      </header>
      
      <div class="bar bar-footer fita-footer">
        <a href="javascript:void(0);" data-href="${ctx.host}/shopping/user-info" class="button userinfo-link">下一步</a>
      </div>
      
      <div class="content">
        <div class="list cars-list-layout">
          <div class="card fita-card">
            <div class="card-content">
              <div class="card-content-inner">
                <!-- <a href=""> -->
                  <div class="car-title">
                  <c:choose>
                      <c:when test="${persist.modelGroups[carDetail.modelName] != null}">
                         ${persist.modelGroups[carDetail.modelName].chineseName}
                      </c:when>
                      <c:otherwise>
                        ${carDetail.modelName}
                      </c:otherwise>
                    </c:choose>
                  </div>
                  <div class="row no-gutter">
                    <div class="col-66 cars-type">
                    <c:choose>
                      <c:when test="${persist.modelGroups[carDetail.modelName] != null}">
                         <img src="${cloudContext.domain}/${persist.modelGroups[carDetail.modelName].picture}"/>
                      </c:when>
                      <c:otherwise>
                        <img src="${carDetail.picture}"/>
                      </c:otherwise>
                    </c:choose>
                      <p>
                      ${persist.getVehicleSize(carDetail.modelCodeClass).chineseName}/
                      ${persist.getVehicleCategory(carDetail.categoryCode).chineseName}/
                      ${carDetail.transmissionType eq 'MANUAL' ? '手动' : '自动'}/
                      ${carDetail.baggageQuantity}件行李/
                      ${carDetail.passengerQuantity}座位/
                      ${carDetail.airConditionIn ? '含空调' : '无空调'}/
                      ${carDetail.modelCodeType eq 'B' ? '2门' : car.modelCodeType eq 'C' ? '2或4门' : '4门或5门'}</p>
                    </div>
                    <div class="col-33 price-box" style="margin-top:.75rem;">
                      <c:set var="currentTotalAmount" value="${persist.generateCouponPrice(carDetail.totalAmount, carDetail.pickupLocation)}"/>
                      <c:choose>
                        <c:when test="${set.payType.arrivepay}">
                          <c:set var="exchangeRate" value="${persist.exchangeRate(carDetail.currencyCode)}"/>
                          <a href="javascript:void(0);" class="item" style="margin-bottom: 1.25rem;">
                            <p>官方零售价：</p>
                            <p class="price"><span style="font-size: .75rem;">${exchangeRate.currencySymbol}</span><fmt:formatNumber value="${carDetail.retailAmount}" type="number" maxFractionDigits="2" pattern="0.00"/></p>
                          </a>
                          <a href="javascript:void(0);" class="item" style="margin-bottom: 1.25rem;">
                            <p>返佣：</p>
                            <p class="price current-price"><span style="font-size: .75rem;">${exchangeRate.currencySymbol}</span><fmt:formatNumber value="${persist.agentCommission(carDetail.totalAmount, carDetail.pickupLocation, agentCompany.rate, agent.company.primaryAgentRate)}" type="number" maxFractionDigits="2" pattern="0.00"/></p>
                          </a>
                        </c:when>
                        <c:when test="${set.payType.floatPrepay || set.payType.dynamicPrepay}">
                          <a href="javascript:void(0);" class="item" style="margin-bottom: 1.25rem;">
                            <p>官方零售价：</p>
                            <p class="price"><span style="font-size: .75rem;">￥</span><fmt:formatNumber value="${carDetail.retailAmount}" type="number" maxFractionDigits="2" pattern="0.00"/></p>
                          </a>
                          <a href="javascript:void(0);" class="item" style="margin-bottom: 1.25rem;">
                            <p>浮动价：</p>
                            <p class="price current-price"><span style="font-size: .75rem;">￥</span><fmt:formatNumber value="${persist.dynamicPrepaid(currentTotalAmount, carDetail.currencyCode, agentCompany.rate, set.payType, agent.company.primaryAgentRate).setScale(0, 0)}" type="number" maxFractionDigits="2" pattern="0.00"/></p>
                          </a>
                        </c:when>
                        <c:otherwise>
                          <a href="javascript:void(0);" class="item" style="margin-bottom: 1.25rem;">
                            <p>官方零售价：</p>
                            <p class="price"><span style="font-size: .75rem;">￥</span><fmt:formatNumber value="${carDetail.retailAmount}" type="number" maxFractionDigits="2" pattern="0.00"/></p>
                          </a>
                          <a href="javascript:void(0);" class="item" style="margin-bottom: 1.25rem;">
                            <p>常规价：</p>
                            <p class="price current-price"><span style="font-size: .75rem;">￥</span><fmt:formatNumber value="${persist.prepaid(currentTotalAmount, carDetail.currencyCode, agentCompany.rate, agent.company.primaryAgentRate).setScale(0, 0)}" type="number" maxFractionDigits="2" pattern="0.00"/></p>
                          </a>
                        </c:otherwise>
                      </c:choose>
                    </div>
                  </div>
                <!-- </a> -->
              </div>
            </div>
          </div>
        </div>
        
        <div class="product-detail">
          <c:if test="${not empty carDetail.feeInclude || not empty set.includeContentMap}">
            <div class="fita-block-title">
              <p class="no-margin">价格包含：</p>
              <span class="pull-right iconfont iconfont-down-arrow"></span>
            </div>
            <div class="box">
                <c:forEach var="includeContent" items="${set.includeContentMap.values()}">
                  <div class="item" style="padding-left: .25rem;">${includeContent}</div>
                </c:forEach>  
              ${carDetail.feeInclude}
            </div>
          </c:if>
          <c:if test="${not empty carDetail.feeUnInclude || not empty carDetail.vehicleCharge}">
            <div class="fita-block-title">
              <p class="no-margin">价格不含：(以下费用不计入总价，需在门店另行支付)</p>
              <span class="pull-right iconfont iconfont-down-arrow"></span>
            </div>
            <div class="box">
              ${carDetail.vehicleCharge }
              ${carDetail.feeUnInclude}
            </div>
          </c:if>
          <div class="fita-block-title">
            <p class="no-margin">增值服务：(以下费用不计入总价，需在门店另行支付)</p>
            <span class="pull-right iconfont iconfont-down-arrow"></span>
          </div>
          <div class="box">
           <c:forEach var="specialEquipment" items="${locationDetail.specialEquipments}">
           <c:if test="${not empty specialEquipment.otherPrice}">
             <div class="item">
               <label>
                 <input type="checkbox" value="${specialEquipment.type}" name="specialEquipment"> ${persist.specialEquipments[specialEquipment.type].chineseName}
                   （${specialEquipment.otherPrice}）
               </label>
             </div>
             </c:if>
           </c:forEach>
          </div>
          
          <!-- <div style="margin: 1rem .5rem;font-weight: bold; font-size: .65rem; color: #262626;">
            <p class="no-margin" style="margin-bottom: .25rem;">此预约可在 2018/11/18 12:00之前取消</p>
            <p class="no-margin">订单一经确认，如乘客人未按指定时间取车，将会被罚款。</p>
          </div> -->
        </div>
      </div>
      
      <!-- <div class="content">
        
       <p>车辆信息详情页面</p>
        
        
        <a ctx.host="">填写用户信息</a>
      </div> -->
      
      <form action="" method="POST" id="userinfoform">
        <input type="hidden" name="countryId" value="${carDetail.countryId}">
        <input type="hidden" name="supplierId" value="${carDetail.supplierId}">
        <input type="hidden" name="type" value="${carDetail.type}">
        <input type="hidden" name="pickupLocation" value="${carDetail.pickupLocation}">
        <input type="hidden" name="returnLocation" value="${carDetail.returnLocation}">
        <input type="hidden" name="pickupDate" value="${carDetail.pickupDateString}">
        <input type="hidden" name="returnDate" value="${carDetail.returnDateString}">
        <input type="hidden" name="driveAge" value="${carDetail.driveAge}">
        <input type="hidden" name="setId" value="${carDetail.setId}">
        <input type="hidden" name="doorCount" value="${carDetail.doorCount}">
        <input type="hidden" name="sizeCode" value="${carDetail.sizeCode}">
        <input type="hidden" name="categoryCode" value="${carDetail.categoryCode}">
        <input type="hidden" name="airConditionIn" value="${carDetail.airConditionIn}">
        <input type="hidden" name="transmissionType" value="${carDetail.transmissionType}">
        <input type="hidden" name="modelName" value="${carDetail.modelName}">
        <input type="hidden" name="modelCode" value="${carDetail.modelCode}">
        <input type="hidden" name="passengerQuantity" value="${carDetail.passengerQuantity}">
        <input type="hidden" name="baggageQuantity" value="${carDetail.baggageQuantity}">
        <input type="hidden" name="totalAmount" value="${carDetail.totalAmount}">
        <input type="hidden" name="esimatedTotalAmount" value="${carDetail.esimatedTotalAmount}">
        <input type="hidden" name="retailAmount" value="${carDetail.retailAmount}">
        <input type="hidden" name="currencyCode" value="${carDetail.currencyCode}">
        <input type="hidden" name="picture" value="${carDetail.picture}">
        <input type="hidden" name="includeOrderFeeId" value="${carDetail.includeOrderFeeId}">
        <input type="hidden" name="vehicleChargeId" value="${carDetail.vehicleChargeId}">
        <input type="hidden" name="unIncludeOrderFeeId" value="${carDetail.unIncludeOrderFeeId}">
        <input type="hidden" name="rateQualifier" value="${carDetail.rateQualifier}">
        <input type="hidden" name="specialEquipments" value="">
      </form>
      
    </div>
    
    <div class="panel-overlay"></div>
    <div class="panel panel-right panel-cover fita-panel">
      <div class="list-block contacts-block no-margin">
        <p class="menu-title close-panel">关闭</p>
        <ul>
          <li>
            <a href="${ctx.host}/cars/search" class="item-content item-link">
              <div class="item-inner">
                <div class="item-title">立即租车</div>
              </div>
            </a>
          </li>
          <li>
            <a href="${ctx.host}/profile" class="item-content item-link">
              <div class="item-inner">
                <div class="item-title">个人中心</div>
              </div>
            </a>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <%@ include file="/WEB-INF/include/script.jsp"%>
  <d:resource type="script" root="${ctx.resource}/build" src="js/page/cars-search/cars-detail.js" />
  <script type="text/javascript">
    require(['page/cars-search/cars-detail'], function(page) {
      page.init({
        "carDetail": JSON.parse('${carsDetailString}')
      })
    })
  </script>
 
</body>
</html>